<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			#dinglan {
				width: 1440px;
				height: 56px;
				border-bottom: 2px solid #E7E7EC;
			}

			#left {
				position: relative;
				left: 24px;
				top: 8px;
				width: 302px;
				height: 40px;
			}

			#flag {
				width: 84px;
				height: 32px;
			}

			#lujing {
				position: relative;
				top: -32px;
				width: 48px;
				height: 40px;
				opacity: 1;
			}

			#log {
				position: relative;
				left: 48px;
				top: 4.13px;
				width: 84px;
				height: 32px;
				opacity: 1;
			}

			#right {
				width: 342px;
				height: 32px;
				position: relative;
				top: -28px;
				left: 1048px;
			}

			#xingming {
				width: 32px;
				height: 32px;
				line-height: 32px;
				font-size: 10.67px;
				float: right;
				position: relative;
				right: -32px;
				text-align: center;
				color: #FFFFFF;
				border-radius: 100px;
				background-color: #A1C1FF;
			}

			#tian {
				width: 234px;
				height: 30px;
				position: relative;
				left: 90px;
			}

			#choice {
				position: relative;
				left: 382px;
				top: -80px;
				width: 430px;
				height: 56px;
			}

			#hangtou {
				width: 560px;
				height: 50px;
				text-align: center;
				line-height: 50px;
				font-size: 16px;
				font-weight: bold;
				position: relative;
				left: -52px;
			}

			#xinximianban {
				width: 340px;
				height: 734px;
			}

			#top {
				width: 340px;
				height: 160px;
				border-bottom: 2px solid #E7E7EC;

			}

			#top1 {
				width: 340px;
				height: 40px;
				position: absolute;
				top: 80px;
			}

			#select {
				width: 24px;
				height: 24px;
				float: left;
				position: relative;
				top: 8px;
				left: 24px;
			}

			#name {
				width: 232px;
				height: 26px;
				float: left;
				position: relative;
				top: 7px;
				left: 32px;
				font-family: PingFang SC;
				font-size: 18px;
				font-weight: bold;
				line-height: 26px;
				color: #1464FF;
			}

			#top2 {
				width: 340px;
				height: 84px;
			}

			#aa {
				float: left;
				font-size: 14px;
				position: absolute;
				left: 48px;
				top: 120px;
			}

			.bo {
				width: 56px;
				height: 20px;
				margin: 8px;
				text-align: right;
				position: relative;
				right: 24px;
			}

			#bb {
				float: right;
				font-size: 14px;
				position: absolute;
				left: 134px;
				top: 120px;
			}

			.ri {
				width: 183px;
				height: 20px;
				margin: 8px;
				text-align: right;
			}

			#mid {
				width: 340px;
				height: 302px;
			}

			#mid1 {
				width: 340px;
				height: 40px;
			}

			#tree {
				font-size: 16px;
				position: relative;
				top: 8px;
				left: 24px;
				font-weight: bold;
			}

			#mid2 {
				width: 316px;
				height: 64px;
				padding-left: 24px;
				border-top: 2px dashed #e7e7e7;
				border-bottom: 2px dashed #e7e7e7;
			}

			.xiangmuxuanxiang {
				width: 292px;
				height: 32px;
				line-height: 32px;
			}

			#dw1 {
				width: 20px;
				height: 20px;
				float: right;
				background-image: url(img/定位.png);
				background-size: 20px 20px;
			}

			#dw2 {
				width: 20px;
				height: 20px;
				float: right;
				position: absolute;
				left: 198px;
				top: 2px;
				background-image: url(img/定位.png);
				background-size: 20px 20px;
			}

			#xiala {
				width: 8px;
				height: 8px;
				position: relative;
				left: 6px;
				display: inline-block;
			}

			#xiangmu1 {
				width: 218px;
				height: 20px;
				line-height: 20px;
				position: relative;
				left: 24px;
				top: -26px;
				font-size: 16px;
			}

			.xiangmuxuanxiang:hover {
				width: 278px;
				height: 32px;
				border-radius: 4px;
				background-color: #A1C1FF;
			}

			#xiangmu2 {
				width: 218px;
				height: 20px;
				line-height: 20px;
				position: relative;
				left: 24px;
				font-size: 16px;
			}

			#bottom {
				width: 340px;
			}

			#bottomtop {
				width: 340px;
				height: 40px;
				border-bottom: 2px solid #e7e7e7;
				border-top: 2px solid #e7e7e7;
			}

			#bottomleft {
				float: left;
				font-size: 14px;
				width: 64px;
				height: 24px;
				position: relative;
				top: 8px;
				left: 24px;
				font-weight: bold;
			}

			#bottomright {
				float: right;
				font-size: 14px;
				width: 121px;
				height: 20px;
				position: relative;
				top: 8px;
				right: 24px;
			}

			#photo01 {
				width: 284px;
				height: 164px;
				background-image: url(img/病害01.png);
				background-size: 284px 164px;
				position: relative;
				top: 40px;
				left: 28px;
			}

			#bingcong {
				width: 284px;
				height: 36px;
				font-size: 12px;
				position: relative;
				left: 28px;
				top: 54px;
				color: #A6A6A6;
			}

			#photo02 {
				width: 1100px;
				height: 733px;
				background-image: url(img/大桥.png);
				background-size: 1700px 1000px;
				background-repeat: no-repeat;
				background-position: -550px -10px;
				position: absolute;
				left: 348px;
				top: 64px;
			}

			#tucheng {
				width: 36px;
				height: 72px;
				position: relative;
				background-color: white;
				top: -710px;
				left: 1390px;
				border-radius: 5px;
			}

			.ma {
				width: 30px;
				height: 30px;
				line-height: 30px;
				text-align: center;
				position: relative;
				top: 6px;
				left: 3px;
			}

			.tuchengguanli {
				width: 30px;
				height: 30px;
				border-radius: 3px;
			}

			#tu {
				position: relative;
				top: 3px;
				width: 22px;
				height: 22px;
			}

			#tuli {
				width: 1078px;
				height: 676px;
				background-image: url(img/放大.png);
				background-size: 1078px 676px;
				position: relative;
				right: 1176px;
				top: -65px;
			}

			#daohang {
				width: 560px;
				height: 56px;
			}

			li {
				width: 80px;
				height: 56px;
				text-align: center;
				line-height: 56px;
				font-size: 18px;
				font-weight: bold;
				float: left;
				list-style: none;
				margin-right: 24px;
				position: relative;
				top: -10px;
			}
li:hover{
	color: #1464FF;
}
			li:active {
				color: #1464FF;
				border-bottom: 2px solid #1464FF;
			}
		</style>
	</head>
	<body>
		<div id="dinglan">
			<div id="left">
				<div id="log"><img src="./img/flight.png" alt="" id="flag" /></div>
				<img src="./img/log.png" alt="" id="lujing" />
			</div>
			<div id="right">
				<div id="xingming">姓名</div>
				<div><img src="./img/天气.png" alt="" id="tian" /></div>
			</div>
			<div id="choice">
				<div id="daohang">
					<ul>
						<li style="color:#1464FF ;border-bottom: 2px solid #1464FF;">首页</li>
						<a href="./manage-a.html" style="color: black;">
							<li>项目管理</li>
						</a>
						<li>巡检航线</li>
						<li>数据统计</li>
						<li>人员管理</li>
					</ul>
				</div>
			</div>
		</div>
		<div id="xinximianban">
			<div id="top">
				<div id="top1"><img src="./img/列表.png" alt="" id="select" />
					<div id="name">铜陵大桥</div>
				</div>
				<div id="top2">
					<div id="aa">
						<div class="bo">路线编号</div>
						<div class="bo">项目数量</div>
						<div class="bo">管养单位</div>
					</div>
					<div id="bb">
						<div class="ri">G330 K816+060-K820+276</div>
						<div class="ri">1个</div>
						<div class="ri">铜陵长江公路大桥管理处</div>
					</div>
				</div>
			</div>
			<div id="mid">
				<div id="mid1">
					<div id="tree">项目树</div>
				</div>
				<div id="mid2">
					<div class="xiangmuxuanxiang"><img src="img/下拉箭头.png" alt="" id="xiala" />
						<div id="xiangmu1">铜陵大桥<div id="dw1"></div>
						</div>

					</div>
					<div class="xiangmuxuanxiang">
						<div id="xiangmu2">铜陵大桥<div id="dw2"></div>
						</div>

					</div>
				</div>
			</div>
			<div id="bottom">
				<div id="bottomtop">
					<div id="bottomleft">病害统计</div>
					<div id="bottomright">技术状况统计：2类</div>
					<div id="photo01"></div>
					<div id="bingcong">*本数据均来自无人机拍摄图片分析得出，数据详情请咨询养护单位。</div>
				</div>
			</div>
		</div>
		<div id="photo02"></div>
		<div id="tucheng">
			<div class="ma"><a href="./design_manage.html"><img src="img/叠层1.png" alt="" class="tuchengguanli"
						id="tu" /></a></div>
			<div class="ma"><a href="check_mark.html"><img src="img/无人机1.png" alt="" class="tuchengguanli" id="ji"
						style="margin-top: 3px;" /></a></div>
			<a href="realtime_transmission.html">
				<div id="tuli"></div>
			</a>
		</div>

	</body>
</html>